<script setup lang="tsx">
import { ref } from 'vue';
import MyTable from '@/components/myTable/index.vue';
import OperatingBox from '@/components/operatingBox/index.vue';
import { formGroup } from '@/components/formDialog/FormDialog';
import FormDialogGroup from '@/components/formDialog/FormDialogGroup.vue';
import { MessagePlugin } from 'tdesign-vue-next';
import { AddIcon } from 'tdesign-icons-vue-next';
import { getList, add } from '@/api/member/migration';

const data = ref([]);
const columns = [
  {
    title: '操作员',
    colKey: 'operator',
  },
  {
    title: '操作内容',
    colKey: 'content',
  },
  {
    title: '操作时间',
    colKey: 'operatorTime',
  },
];

const pagination = ref({
  defaultCurrent: 1,
  defaultPageSize: 10,
  total: 0,
});

const render = () => (
  <>
    <OperatingBox>
      <t-button icon={() => <AddIcon />} onClick={() => unAdd()}>
        新增
      </t-button>
    </OperatingBox>
    <MyTable
      columns={columns}
      data={data.value}
      v-model:pagination={pagination.value}
      rowKey="mid"
      onUnGetList={unGetList}
    ></MyTable>
  </>
);

const unGetList = async () => {
  try {
    const res = await getList({
      pageNum: pagination.value.defaultCurrent,
      pageSize: pagination.value.defaultPageSize,
    });
    data.value = res.rows;
    pagination.value = {
      ...pagination.value,
      total: res.total,
    };
  } catch (e) {
    console.log(e);
  }
};

unGetList();
/** 添加对话框 */
const formObj = new formGroup();
const unAdd = async () => {
  try {
    formObj.show('代理迁移', {}, '代理迁移');
  } catch (e) {
    console.error(e);
    MessagePlugin.error(e);
  }
};

formObj.add<any>(
  '代理迁移',
  '代理迁移',
  {},
  async (body) => {
    await add(body.data);
    unGetList();
  },
  {
    bqUserName: [{ required: true, message: '被迁移代理不能为空', trigger: 'change' }],
    quserName: [{ required: true, message: '迁移至代理不能为空', trigger: 'blur' }],
    // safeCode: [{ required: true, message: '安全码不能为空', trigger: 'blur' }],
  },
);
</script>

<template>
  <div>
    <render />
    <FormDialogGroup :form-obj="formObj">
      <template #default="{ formData, item }">
        <!-- 代理迁移对话框 -->
        <template v-if="item == '代理迁移'">
          <t-form-item label="被迁移代理" name="bqUserName" help="注意：被迁移代理包括下级，是整条线迁移。">
            <t-input v-model="formData.bqUserName" placeholder="请输入被迁移代理的账号" />
          </t-form-item>
          <t-form-item label="迁移至代理" name="quserName">
            <t-input v-model="formData.quserName" placeholder="请输入迁移后的代理账号" />
          </t-form-item>
          <!-- <t-form-item label="安全码" name="safeCode">
            <t-input type="password" v-model="formData.safeCode" placeholder="请输入安全码" />
          </t-form-item> -->
        </template>
      </template>
    </FormDialogGroup>
  </div>
</template>
